<div class="filter">
    <div class="f1 item" style="width: 90px;">
        <input type="text" class="am-form-field" placeholder="起始日期" id="start"
            data-am-datepicker="{theme:'success'}" readonly required />
    </div>
    <div class="f2 item" style="width: 90px;">
        <input type="text" class="am-form-field" placeholder="结束日期" id="end"
            data-am-datepicker="{theme:'success'}" readonly required />
    </div>
    <div class="f3 item">
        <input type="text" class="am-form-field" placeholder="用户名" />
    </div>
    
    <div class="button item">
        <button type="button" class="am-btn am-btn-primary">查看</button>
    </div>
</div>

<div class="clue red">【操作提示】鼠标移到指令列，可查看日志详情。</div>
<table class="am-table am-table-bordered am-table-striped am-table-compact" id="result-table">
  <thead>
  <tr>
    <th width="120px">时间</th>
    <th width="100px">用户</th>
    <th width="80px">角色</th>
    <th width="150px">IP</th>
    <th>指令</th>
    <th>分类</th>
    <th>详情</th>
  </tr>
  </thead>
  <tbody>
  </tbody>
</table>
<div class="zxf_pagediv"></div>

<script src="../public/all/js/pages/oper_log.js"></script>
<script>
    $(".f1 input").datepicker({
        format: 'yyyy-mm-dd'
    });
    $(".f2 input").datepicker({
        format: 'yyyy-mm-dd'
    });
    Util.restorePageFilter();

    var _f = Util.queryTemplate($("#result-table tbody"), ".zxf_pagediv", $(".button button"), function(page, size, cb) {
        var data = {
            pageNum: page,
            pageSize: size,
        };
        var v = $(".f1 input").val().trim();
        if (v) data.start = v;
        var v = $(".f2 input").val().trim();
        if (v) data.end = v;
        var v = $(".f3 input").val().trim();
        if (v) data.uid = v;

        Util.savePageFilter([".f1 input", ".f2 input", ".f3 input"]);
        startLoading();
        CMD.journal_query(data, function(r) {
            stopLoading();
            cb(r);
        });
    }, function(table, list, sum) {
        if (Util.isEmpty(list)) {
            table.append("<tr><td colspan='5'>暂无数据</tr>");
            return;
        }

        var ips = [];
        for (var i in list) {
            var d = list[i];
            var tr = $("<tr></tr>");
            tr.append('<td>' + d.time + '</td>');
            tr.append("<td>" + (d.user.mobile || '') + '</td>');
            tr.append("<td>" + Rights.roles[(d.user.grade || '1')] + '</td>');
            tr.append("<td class='ip'>" + (d.ip || '') + '</td>');
            tr.append('<td class="uri">' + operLogUI.convertUri(d.uri) + '</td>');
            tr.append("<td>--</td>");
            tr.append("<td>--</td>");
            table.append(tr);
            if (d.ip && ips.indexOf(d.ip) == -1) ips.push(d.ip);
        }

        var arr = $("td.uri");
        for (var i = 0; i < arr.length; i++) {
            operLogUI.registerPopover($(arr[i]), i, list);
        }

        for (var i in ips) operLogUI.registerIp(ips[i]);
    });
</script>
